வெப்ஜிஎல்லில் தேர்ச்சி பெறுதல்: டிஃபர்டு ரெண்டரிங் மற்றும் ஜி-பஃப்பருடன் கூடிய மல்டிபிள் ரெண்டர் டார்கெட்களின் (MRTs) சக்தி

சமீபத்திய ஆண்டுகளில் இணைய கிராபிக்ஸ் உலகம் நம்பமுடியாத முன்னேற்றங்களைக் கண்டுள்ளது. இணைய உலாவிகளில் 3டி கிராபிக்ஸ்களை ரெண்டரிங் செய்வதற்கான தரமான வெப்ஜிஎல் (WebGL), டெவலப்பர்களுக்கு பிரமிக்க வைக்கும் மற்றும் ஊடாடும் காட்சி அனுபவங்களை உருவாக்க அதிகாரம் அளித்துள்ளது. இந்த வழிகாட்டி, டிஃபர்டு ரெண்டரிங் எனப்படும் ஒரு சக்திவாய்ந்த ரெண்டரிங் நுட்பத்தை ஆழமாக ஆராய்கிறது, இது மல்டிபிள் ரெண்டர் டார்கெட்கள் (MRTs) மற்றும் ஜி-பஃப்பரின் திறன்களைப் பயன்படுத்தி ஈர்க்கக்கூடிய காட்சித் தரத்தையும் செயல்திறனையும் அடைகிறது. இது உலகளவில் கேம் டெவலப்பர்கள் மற்றும் விஷுவலைசேஷன் நிபுணர்களுக்கு இன்றியமையாதது.

ரெண்டரிங் பைப்லைனைப் புரிந்துகொள்வது: அடிப்படை

டிஃபர்டு ரெண்டரிங்கை ஆராய்வதற்கு முன், பல 3டி பயன்பாடுகளில் பயன்படுத்தப்படும் வழக்கமான முறையான ஃபார்வர்டு ரெண்டரிங் பைப்லைனைப் புரிந்துகொள்வது முக்கியம். ஃபார்வர்டு ரெண்டரிங்கில், காட்சியில் உள்ள ஒவ்வொரு பொருளும் தனித்தனியாக ரெண்டர் செய்யப்படுகிறது. ஒவ்வொரு பொருளுக்கும், லைட்டிங் கணக்கீடுகள் நேரடியாக ரெண்டரிங் செயல்பாட்டின் போது செய்யப்படுகின்றன. அதாவது, ஒரு பொருளைப் பாதிக்கும் ஒவ்வொரு ஒளி மூலத்திற்கும், ஷேடர் (GPU-வில் இயங்கும் ஒரு நிரல்) இறுதி நிறத்தைக் கணக்கிடுகிறது. இந்த அணுகுமுறை, நேரடியானதாக இருந்தாலும், குறிப்பாக ஏராளமான ஒளி மூலங்கள் மற்றும் சிக்கலான பொருள்கள் உள்ள காட்சிகளில் கணக்கீட்டு ரீதியாக விலை உயர்ந்ததாக மாறும். பல விளக்குகளால் பாதிக்கப்பட்டால் ஒவ்வொரு பொருளையும் பலமுறை ரெண்டர் செய்ய வேண்டும்.

ஃபார்வர்டு ரெண்டரிங்கின் வரம்புகள்

• செயல்திறன் தடைகள்: ஒவ்வொரு பொருளுக்கும், ஒவ்வொரு ஒளியுடன் லைட்டிங்கைக் கணக்கிடுவது அதிக எண்ணிக்கையிலான ஷேடர் செயல்பாடுகளுக்கு வழிவகுக்கிறது, இது GPU-வை சிரமப்படுத்துகிறது. இது குறிப்பாக அதிக எண்ணிக்கையிலான விளக்குகளைக் கையாளும் போது செயல்திறனைப் பாதிக்கிறது.
• ஷேடர் சிக்கலானது: பொருளின் ஷேடருக்குள் நேரடியாக பல்வேறு லைட்டிங் மாதிரிகள் (எ.கா., டிஃப்யூஸ், ஸ்பெகுலர், ஆம்பியன்ட்) மற்றும் நிழல் கணக்கீடுகளை இணைப்பது ஷேடர் குறியீட்டை சிக்கலாக்குகிறது மற்றும் பராமரிப்பதை கடினமாக்குகிறது.
• மேம்படுத்தல் சவால்கள்: பல டைனமிக் விளக்குகள் அல்லது பல சிக்கலான பொருள்கள் உள்ள காட்சிகளுக்கு ஃபார்வர்டு ரெண்டரிங்கை மேம்படுத்துவதற்கு ஃபிரஸ்டம் கல்லிங் (கேமராவின் பார்வையில் தெரியும் பொருள்களை மட்டும் வரைதல்) மற்றும் அக்லூஷன் கல்லிங் (மற்றவற்றின் பின்னால் மறைந்திருக்கும் பொருள்களை வரையாமல் இருப்பது) போன்ற அதிநவீன நுட்பங்கள் தேவைப்படுகின்றன, இது இன்னும் சவாலானதாக இருக்கலாம்.

டிஃபர்டு ரெண்டரிங்கை அறிமுகப்படுத்துதல்: ஒரு முன்னுதாரண மாற்றம்

டிஃபர்டு ரெண்டரிங், ஃபார்வர்டு ரெண்டரிங்கின் வரம்புகளைக் குறைக்கும் ஒரு மாற்று அணுகுமுறையை வழங்குகிறது. இது ஜியோமெட்ரி மற்றும் லைட்டிங் பாஸ்களைப் பிரிக்கிறது, ரெண்டரிங் செயல்முறையை தனித்துவமான நிலைகளாக உடைக்கிறது. இந்த பிரிப்பு, குறிப்பாக அதிக எண்ணிக்கையிலான ஒளி மூலங்களைக் கையாளும் போது, லைட்டிங் மற்றும் ஷேடிங்கை மிகவும் திறமையாகக் கையாள அனுமதிக்கிறது. அடிப்படையில், இது ஜியோமெட்ரி மற்றும் லைட்டிங் நிலைகளைப் பிரிக்கிறது, லைட்டிங் கணக்கீடுகளை மிகவும் திறமையானதாக மாற்றுகிறது.

டிஃபர்டு ரெண்டரிங்கின் இரண்டு முக்கிய நிலைகள்

1. ஜியோமெட்ரி பாஸ் (ஜி-பஃப்பர் உருவாக்கம்): இந்த ஆரம்ப கட்டத்தில், காட்சியில் உள்ள அனைத்துத் தெரியும் பொருட்களையும் ரெண்டர் செய்கிறோம், ஆனால் இறுதி பிக்சல் நிறத்தை நேரடியாகக் கணக்கிடுவதற்குப் பதிலாக, ஒவ்வொரு பிக்சல் பற்றிய தொடர்புடைய தகவல்களையும் ஜி-பஃப்பர் (ஜியோமெட்ரி பஃப்பர்) எனப்படும் டெக்ஸ்சர் தொகுப்பில் சேமிக்கிறோம். ஜி-பஃப்பர் ஒரு இடைத்தரகராக செயல்படுகிறது, பல்வேறு ஜியோமெட்ரிக் மற்றும் மெட்டீரியல் பண்புகளை சேமிக்கிறது. இதில் பின்வருவன அடங்கும்:
   • அல்பிடோ (அடிப்படை நிறம்): எந்த லைட்டிங்கும் இல்லாத பொருளின் நிறம்.
   • நார்மல்: மேற்பரப்பின் நார்மல் வெக்டர் (மேற்பரப்பு எதிர்கொள்ளும் திசை).
   • நிலை (உலக வெளி): உலகில் பிக்சலின் 3டி நிலை.
   • ஸ்பெகுலர் பவர்/ரஃப்னஸ்: மெட்டீரியலின் பளபளப்பு அல்லது சொரசொரப்பைக் கட்டுப்படுத்தும் பண்புகள்.
   • பிற மெட்டீரியல் பண்புகள்: ஷேடர் மற்றும் காட்சியின் தேவைகளைப் பொறுத்து, மெட்டல்னஸ், ஆம்பியன்ட் அக்லூஷன் போன்றவை.
2. லைட்டிங் பாஸ்: ஜி-பஃப்பர் நிரப்பப்பட்ட பிறகு, இரண்டாவது பாஸ் லைட்டிங்கைக் கணக்கிடுகிறது. லைட்டிங் பாஸ் காட்சியில் உள்ள ஒவ்வொரு ஒளி மூலத்தையும் கடந்து செல்கிறது. ஒவ்வொரு ஒளிக்கும், அது ஜி-பஃப்பரை மாதிரி எடுத்து, ஒளியின் செல்வாக்கிற்குள் இருக்கும் ஒவ்வொரு ஃபிராக்மென்ட்டின் (பிக்சல்) தொடர்புடைய தகவல்களை (நிலை, நார்மல், அல்பிடோ போன்றவை) மீட்டெடுக்கிறது. ஜி-பஃப்பரில் இருந்து பெறப்பட்ட தகவல்களைப் பயன்படுத்தி லைட்டிங் கணக்கீடுகள் செய்யப்படுகின்றன, மேலும் இறுதி நிறம் தீர்மானிக்கப்படுகிறது. பின்னர் ஒளியின் பங்களிப்பு ஒரு இறுதிப் படத்தில் சேர்க்கப்படுகிறது, இது ஒளி பங்களிப்புகளை திறம்பட கலக்கிறது.

ஜி-பஃப்பர்: டிஃபர்டு ரெண்டரிங்கின் இதயம்

ஜி-பஃப்பர் என்பது டிஃபர்டு ரெண்டரிங்கின் அடித்தளமாகும். இது டெக்ஸ்சர்களின் ஒரு தொகுப்பாகும், இது பெரும்பாலும் மல்டிபிள் ரெண்டர் டார்கெட்களை (MRTs) பயன்படுத்தி ஒரே நேரத்தில் ரெண்டர் செய்யப்படுகிறது. ஜி-பஃப்பரில் உள்ள ஒவ்வொரு டெக்ஸ்சரும் ஒவ்வொரு பிக்சல் பற்றிய வெவ்வேறு தகவல்களைச் சேமிக்கிறது, இது ஜியோமெட்ரி மற்றும் மெட்டீரியல் பண்புகளுக்கான கேஷாக செயல்படுகிறது.

மல்டிபிள் ரெண்டர் டார்கெட்ஸ் (MRTs): ஜி-பஃப்பரின் ஒரு மூலக்கல்

மல்டிபிள் ரெண்டர் டார்கெட்ஸ் (MRTs) என்பது ஒரு முக்கியமான WebGL அம்சமாகும், இது ஒரே நேரத்தில் பல டெக்ஸ்சர்களுக்கு ரெண்டர் செய்ய உங்களை அனுமதிக்கிறது. ஒரே ஒரு கலர் பஃப்பருக்கு (ஃபிராக்மென்ட் ஷேடரின் வழக்கமான வெளியீடு) எழுதுவதற்குப் பதிலாக, நீங்கள் பலவற்றிற்கு எழுதலாம். இது ஜி-பஃப்பரை உருவாக்குவதற்கு மிகவும் பொருத்தமானது, அங்கு நீங்கள் அல்பிடோ, நார்மல், மற்றும் நிலைத் தரவை மற்றவற்றுடன் சேமிக்க வேண்டும். MRTs மூலம், ஒவ்வொரு தரவையும் ஒரே ரெண்டரிங் பாஸில் தனித்தனி டெக்ஸ்சர் டார்கெட்களுக்கு வெளியிடலாம். இது ஜியோமெட்ரி பாஸை கணிசமாக மேம்படுத்துகிறது, ஏனெனில் தேவையான அனைத்து தகவல்களும் முன்கூட்டியே கணக்கிடப்பட்டு லைட்டிங் பாஸின் போது பின்னர் பயன்படுத்த சேமிக்கப்படுகின்றன.

ஜி-பஃப்பருக்கு ஏன் MRTs பயன்படுத்த வேண்டும்?

• செயல்திறன்: தரவைச் சேகரிக்க பல ரெண்டரிங் பாஸ்களின் தேவையை நீக்குகிறது. ஜி-பஃப்பருக்கான அனைத்து தகவல்களும் ஒரே பாஸில், ஒரே ஜியோமெட்ரி ஷேடரைப் பயன்படுத்தி எழுதப்படுகின்றன, இது செயல்முறையை நெறிப்படுத்துகிறது.
• தரவு அமைப்பு: தொடர்புடைய தரவை ஒன்றாக வைத்திருக்கிறது, லைட்டிங் கணக்கீடுகளை எளிதாக்குகிறது. லைட்டிங் ஷேடர் ஒரு பிக்சலின் லைட்டிங்கைத் துல்லியமாகக் கணக்கிடத் தேவையான அனைத்து தகவல்களையும் எளிதாக அணுக முடியும்.
• நெகிழ்வுத்தன்மை: தேவைக்கேற்ப பல்வேறு வகையான ஜியோமெட்ரிக் மற்றும் மெட்டீரியல் பண்புகளைச் சேமிப்பதற்கான நெகிழ்வுத்தன்மையை வழங்குகிறது. கூடுதல் மெட்டீரியல் பண்புகள் அல்லது ஆம்பியன்ட் அக்லூஷன் போன்ற கூடுதல் தரவைச் சேர்க்க இதை எளிதாக விரிவாக்கலாம், மேலும் இது ஒரு மாற்றியமைக்கக்கூடிய நுட்பமாகும்.

வெப்ஜிஎல்லில் டிஃபர்டு ரெண்டரிங்கை செயல்படுத்துதல்

வெப்ஜிஎல்லில் டிஃபர்டு ரெண்டரிங்கை செயல்படுத்துவது பல படிகளை உள்ளடக்கியது. முக்கிய கருத்துக்களை விளக்க ஒரு எளிமையான உதாரணத்தைப் பார்ப்போம். இது ஒரு மேலோட்டமான பார்வை என்பதை நினைவில் கொள்ளுங்கள், மேலும் திட்டத் தேவைகளைப் பொறுத்து சிக்கலான செயலாக்கங்கள் உள்ளன.

1. ஜி-பஃப்பர் டெக்ஸ்சர்களை அமைத்தல்

ஜி-பஃப்பர் தரவைச் சேமிக்க நீங்கள் ஒரு வெப்ஜிஎல் டெக்ஸ்சர் தொகுப்பை உருவாக்க வேண்டும். டெக்ஸ்சர்களின் எண்ணிக்கை மற்றும் ஒவ்வொன்றிலும் சேமிக்கப்படும் தரவு உங்கள் தேவைகளைப் பொறுத்தது. பொதுவாக, உங்களுக்கு குறைந்தபட்சம் தேவைப்படும்:

• அல்பிடோ டெக்ஸ்சர்: பொருளின் அடிப்படை நிறத்தைச் சேமிக்க.
• நார்மல் டெக்ஸ்சர்: மேற்பரப்பு நார்மல்களைச் சேமிக்க.
• நிலை டெக்ஸ்சர்: பிக்சலின் உலக-வெளி நிலையைச் சேமிக்க.
• விருப்ப டெக்ஸ்சர்கள்: ஸ்பெகுலர் பவர்/ரஃப்னஸ், ஆம்பியன்ட் அக்லூஷன் மற்றும் பிற மெட்டீரியல் பண்புகளைச் சேமிப்பதற்கான டெக்ஸ்சர்களையும் நீங்கள் சேர்க்கலாம்.

நீங்கள் டெக்ஸ்சர்களை எவ்வாறு உருவாக்குவீர்கள் என்பது இங்கே (விளக்க உதாரணம், ஜாவாஸ்கிரிப்ட் மற்றும் வெப்ஜிஎல் பயன்படுத்தி):

```javascript // WebGL context-ஐப் பெறுக const gl = canvas.getContext('webgl2'); // ஒரு texture-ஐ உருவாக்க ஒரு செயல்பாடு function createTexture(gl, width, height, internalFormat, format, type, data = null) { const texture = gl.createTexture(); gl.bindTexture(gl.TEXTURE_2D, texture); gl.texImage2D(gl.TEXTURE_2D, 0, internalFormat, width, height, 0, format, type, data); gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST); gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST); gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE); gl.bindTexture(gl.TEXTURE_2D, null); return texture; } // resolution-ஐ வரையறுக்கவும் const width = canvas.width; const height = canvas.height; // G-Buffer texture-களை உருவாக்கவும் const albedoTexture = createTexture(gl, width, height, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE); const normalTexture = createTexture(gl, width, height, gl.RGBA16F, gl.RGBA, gl.FLOAT); const positionTexture = createTexture(gl, width, height, gl.RGBA32F, gl.RGBA, gl.FLOAT); // ஒரு framebuffer-ஐ உருவாக்கி, அதனுடன் texture-களை இணைக்கவும் const gBufferFramebuffer = gl.createFramebuffer(); gl.bindFramebuffer(gl.FRAMEBUFFER, gBufferFramebuffer); // MRT-களைப் பயன்படுத்தி texture-களை framebuffer-உடன் இணைக்கவும் (WebGL 2.0) gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, albedoTexture, 0); gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT1, gl.TEXTURE_2D, normalTexture, 0); gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT2, gl.TEXTURE_2D, positionTexture, 0); // framebuffer முழுமைத்தன்மையைச் சரிபார்க்கவும் const status = gl.checkFramebufferStatus(gl.FRAMEBUFFER); if (status !== gl.FRAMEBUFFER_COMPLETE) { console.error('Framebuffer is not complete: ', status); } // இணைப்பை நீக்கு gl.bindFramebuffer(gl.FRAMEBUFFER, null); ```

2. MRTs உடன் ஃபிரேம்பஃப்பரை அமைத்தல்

வெப்ஜிஎல் 2.0 இல், MRTs க்கான ஃபிரேம்பஃப்பரை அமைப்பது, ஃபிராக்மென்ட் ஷேடரில் ஒவ்வொரு டெக்ஸ்சரும் எந்த வண்ண இணைப்புகளுடன் பிணைக்கப்பட்டுள்ளது என்பதைக் குறிப்பிடுவதை உள்ளடக்கியது. இதை நீங்கள் எப்படிச் செய்வது என்பது இங்கே:

```javascript // இணைப்புகளின் பட்டியல். முக்கியம்: இது உங்கள் ஷேடரில் உள்ள வண்ண இணைப்புகளின் எண்ணிக்கையுடன் பொருந்துவதை உறுதிசெய்யவும்! const attachments = [ gl.COLOR_ATTACHMENT0, gl.COLOR_ATTACHMENT1, gl.COLOR_ATTACHMENT2 ]; gl.drawBuffers(attachments); ```

3. ஜியோமெட்ரி பாஸ் ஷேடர் (ஃபிராக்மென்ட் ஷேடர் உதாரணம்)

இங்குதான் நீங்கள் ஜி-பஃப்பர் டெக்ஸ்சர்களுக்கு எழுதுவீர்கள். ஃபிராக்மென்ட் ஷேடர் வெர்டெக்ஸ் ஷேடரிலிருந்து தரவைப் பெற்று, ரெண்டர் செய்யப்படும் ஒவ்வொரு பிக்சலுக்கும் வண்ண இணைப்புகளுக்கு (ஜி-பஃப்பர் டெக்ஸ்சர்கள்) வெவ்வேறு தரவை வெளியிடுகிறது. இது `gl_FragData` ஐப் பயன்படுத்தி செய்யப்படுகிறது, இது தரவை வெளியிட ஃபிராக்மென்ட் ஷேடருக்குள் குறிப்பிடப்படலாம்.

```glsl #version 300 es precision highp float; // vertex ஷேடரிலிருந்து உள்ளீடு in vec3 vNormal; in vec3 vPosition; in vec2 vUV; // யூனிஃபார்ம்கள் - உதாரணம் uniform sampler2D uAlbedoTexture; // MRT-களுக்கு வெளியீடு layout(location = 0) out vec4 outAlbedo; layout(location = 1) out vec4 outNormal; layout(location = 2) out vec4 outPosition; void main() { // அல்பிடோ: ஒரு texture-இலிருந்து பெறவும் (அல்லது பொருளின் பண்புகளின் அடிப்படையில் கணக்கிடவும்) outAlbedo = texture(uAlbedoTexture, vUV); // நார்மல்: நார்மல் வெக்டரை அனுப்பவும் outNormal = vec4(normalize(vNormal), 1.0); // நிலை: நிலையை அனுப்பவும் (உதாரணமாக, உலக வெளியில்) outPosition = vec4(vPosition, 1.0); } ```

முக்கிய குறிப்பு: ஃபிராக்மென்ட் ஷேடரில் உள்ள `layout(location = 0)`, `layout(location = 1)`, மற்றும் `layout(location = 2)` வழிமுறைகள், ஒவ்வொரு வெளியீட்டு மாறி எந்த வண்ண இணைப்புக்கு (அதாவது, ஜி-பஃப்பர் டெக்ஸ்சர்) எழுதுகிறது என்பதைக் குறிப்பிடுவதற்கு அவசியமானவை. இந்த எண்கள் டெக்ஸ்சர்கள் ஃபிரேம்பஃப்பருடன் இணைக்கப்பட்ட வரிசையுடன் பொருந்துவதை உறுதிசெய்யவும். மேலும் `gl_FragData` வழக்கொழிந்துவிட்டது என்பதையும் கவனத்தில் கொள்ளவும்; வெப்ஜிஎல் 2.0 இல் MRT வெளியீடுகளை வரையறுக்க `layout(location)` என்பது விரும்பப்படும் வழியாகும்.

4. லைட்டிங் பாஸ் ஷேடர் (ஃபிராக்மென்ட் ஷேடர் உதாரணம்)

லைட்டிங் பாஸில், நீங்கள் ஜி-பஃப்பர் டெக்ஸ்சர்களை ஷேடருடன் பிணைத்து, அவற்றுள் சேமிக்கப்பட்ட தரவைப் பயன்படுத்தி லைட்டிங்கைக் கணக்கிடுகிறீர்கள். இந்த ஷேடர் காட்சியில் உள்ள ஒவ்வொரு ஒளி மூலத்தையும் கடந்து செல்கிறது.

```glsl #version 300 es precision highp float; // உள்ளீடுகள் (vertex ஷேடரிலிருந்து) in vec2 vUV; // யூனிஃபார்ம்கள் (G-Buffer texture-கள் மற்றும் விளக்குகள்) uniform sampler2D uAlbedoTexture; uniform sampler2D uNormalTexture; uniform sampler2D uPositionTexture; uniform vec3 uLightPosition; uniform vec3 uLightColor; // வெளியீடு out vec4 fragColor; void main() { // G-Buffer texture-களை மாதிரியாக எடுக்கவும் vec4 albedo = texture(uAlbedoTexture, vUV); vec4 normal = texture(uNormalTexture, vUV); vec4 position = texture(uPositionTexture, vUV); // ஒளியின் திசையைக் கணக்கிடவும் vec3 lightDirection = normalize(uLightPosition - position.xyz); // டிஃப்யூஸ் லைட்டிங்கைக் கணக்கிடவும் float diffuse = max(dot(normal.xyz, lightDirection), 0.0); vec3 lighting = uLightColor * diffuse * albedo.rgb; fragColor = vec4(lighting, albedo.a); } ```

5. ரெண்டரிங் மற்றும் பிளெண்டிங்

1. ஜியோமெட்ரி பாஸ் (முதல் பாஸ்): காட்சியை ஜி-பஃப்பருக்கு ரெண்டர் செய்யவும். இது ஒரே பாஸில் ஃபிரேம்பஃப்பருடன் இணைக்கப்பட்ட அனைத்து டெக்ஸ்சர்களுக்கும் எழுதுகிறது. இதற்கு முன், நீங்கள் `gBufferFramebuffer`-ஐ ரெண்டர் டார்கெட்டாக பிணைக்க வேண்டும். ஃபிராக்மென்ட் ஷேடரில் உள்ள `layout(location = ...)` வழிமுறைகளுடன் இணைந்து `gl.drawBuffers()` முறை ஒவ்வொரு இணைப்புக்கான வெளியீட்டைக் குறிப்பிடப் பயன்படுகிறது.

```javascript gl.bindFramebuffer(gl.FRAMEBUFFER, gBufferFramebuffer); gl.drawBuffers(attachments); // முன்பு இருந்த attachments வரிசையைப் பயன்படுத்தவும் gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); // ஃபிரேம்பஃப்பரை அழிக்கவும் // உங்கள் பொருட்களை ரெண்டர் செய்யவும் (draw calls) gl.bindFramebuffer(gl.FRAMEBUFFER, null); ```

2. லைட்டிங் பாஸ் (இரண்டாவது பாஸ்): முழுத் திரையையும் உள்ளடக்கிய ஒரு குவாட் (அல்லது ஒரு முழுத்திரை முக்கோணம்) ரெண்டர் செய்யவும். இந்த குவாட் இறுதி, ஒளியூட்டப்பட்ட காட்சிக்கு ரெண்டர் டார்கெட் ஆகும். அதன் ஃபிராக்மென்ட் ஷேடரில், ஜி-பஃப்பர் டெக்ஸ்சர்களை மாதிரியாக எடுத்து லைட்டிங்கைக் கணக்கிடவும். லைட்டிங் பாஸை ரெண்டர் செய்வதற்கு முன் நீங்கள் `gl.disable(gl.DEPTH_TEST);` ஐ அமைக்க வேண்டும். ஜி-பஃப்பர் உருவாக்கப்பட்ட பிறகு மற்றும் ஃபிரேம்பஃப்பர் null ஆக அமைக்கப்பட்டு திரை-குவாட் ரெண்டர் செய்யப்பட்ட பிறகு, விளக்குகள் பயன்படுத்தப்பட்ட இறுதிப் படத்தைக் காண்பீர்கள்.

```javascript gl.bindFramebuffer(gl.FRAMEBUFFER, null); gl.disable(gl.DEPTH_TEST); // லைட்டிங் பாஸ் ஷேடரைப் பயன்படுத்தவும் // G-Buffer texture-களை யூனிஃபார்ம்களாக லைட்டிங் ஷேடருடன் பிணைக்கவும் gl.activeTexture(gl.TEXTURE0); gl.bindTexture(gl.TEXTURE_2D, albedoTexture); gl.uniform1i(albedoTextureLocation, 0); gl.activeTexture(gl.TEXTURE1); gl.bindTexture(gl.TEXTURE_2D, normalTexture); gl.uniform1i(normalTextureLocation, 1); gl.activeTexture(gl.TEXTURE2); gl.bindTexture(gl.TEXTURE_2D, positionTexture); gl.uniform1i(positionTextureLocation, 2); // குவாடை வரையவும் gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4); gl.enable(gl.DEPTH_TEST); ```

டிஃபர்டு ரெண்டரிங்கின் நன்மைகள்

டிஃபர்டு ரெண்டரிங் பல குறிப்பிடத்தக்க நன்மைகளை வழங்குகிறது, இது இணையப் பயன்பாடுகளில் 3டி கிராபிக்ஸ் ரெண்டரிங் செய்வதற்கு ஒரு சக்திவாய்ந்த நுட்பமாக அமைகிறது:

• திறமையான லைட்டிங்: லைட்டிங் கணக்கீடுகள் தெரியும் பிக்சல்களில் மட்டுமே செய்யப்படுகின்றன. இது தேவையான கணக்கீடுகளின் எண்ணிக்கையை வியத்தகு முறையில் குறைக்கிறது, குறிப்பாக பல ஒளி மூலங்களைக் கையாளும் போது, இது பெரிய உலகளாவிய திட்டங்களுக்கு மிகவும் மதிப்புமிக்கது.
• குறைக்கப்பட்ட ஓவர்டிரா: ஜியோமெட்ரி பாஸ் ஒரு பிக்சலுக்கு ஒரு முறை மட்டுமே தரவைக் கணக்கிட்டு சேமிக்க வேண்டும். லைட்டிங் பாஸ் ஒவ்வொரு ஒளிக்கும் ஜியோமெட்ரியை மீண்டும் ரெண்டர் செய்யத் தேவையில்லாமல் லைட்டிங் கணக்கீடுகளைப் பயன்படுத்துகிறது, இதன் மூலம் ஓவர்டிரா குறைகிறது.
• அளவிடுதல்: டிஃபர்டு ரெண்டரிங் அளவிடுதலில் சிறந்து விளங்குகிறது. ஜியோமெட்ரி பாஸ் பாதிக்கப்படாததால், அதிக விளக்குகளைச் சேர்ப்பது செயல்திறனில் வரையறுக்கப்பட்ட தாக்கத்தை ஏற்படுத்துகிறது. கணக்கீடுகளின் எண்ணிக்கையைக் குறைக்க டைல்டு அல்லது கிளஸ்டர்டு அணுகுமுறைகளைப் பயன்படுத்துவது போன்ற செயல்திறனை மேலும் மேம்படுத்த லைட்டிங் பாஸை மேம்படுத்தலாம்.
• ஷேடர் சிக்கலான மேலாண்மை: ஜி-பஃப்பர் செயல்முறையை சுருக்கி, ஷேடர் மேம்பாட்டை எளிதாக்குகிறது. ஜியோமெட்ரி பாஸ் ஷேடர்களை மாற்றாமல் லைட்டிங்கில் மாற்றங்களை திறமையாக செய்யலாம்.

சவால்கள் மற்றும் கருத்தில் கொள்ள வேண்டியவை

டிஃபர்டு ரெண்டரிங் சிறந்த செயல்திறன் நன்மைகளை வழங்கினாலும், இது சவால்கள் மற்றும் கருத்தில் கொள்ள வேண்டியவற்றுடனும் வருகிறது:

• நினைவக நுகர்வு: ஜி-பஃப்பர் டெக்ஸ்சர்களைச் சேமிப்பதற்கு கணிசமான அளவு நினைவகம் தேவைப்படுகிறது. இது உயர்-தெளிவுத்திறன் காட்சிகள் அல்லது குறைந்த நினைவகம் கொண்ட சாதனங்களுக்கு ஒரு கவலையாக மாறும். மேம்படுத்தப்பட்ட ஜி-பஃப்பர் வடிவங்கள் மற்றும் பாதி-துல்லிய மிதவைப் புள்ளி எண்கள் போன்ற நுட்பங்கள் இதைக் குறைக்க உதவும்.
• அலியாசிங் சிக்கல்கள்: ஜியோமெட்ரி பாஸுக்குப் பிறகு லைட்டிங் கணக்கீடுகள் செய்யப்படுவதால், அலியாசிங் போன்ற சிக்கல்கள் மிகவும் வெளிப்படையாகத் தெரியலாம். அலியாசிங் கலைப்பொருட்களைக் குறைக்க ஆன்டி-அலியாசிங் நுட்பங்களைப் பயன்படுத்தலாம்.
• வெளிப்படைத்தன்மை சவால்கள்: டிஃபர்டு ரெண்டரிங்கில் வெளிப்படைத்தன்மையைக் கையாள்வது சிக்கலானதாக இருக்கலாம். வெளிப்படையான பொருட்களுக்கு சிறப்பு சிகிச்சை தேவைப்படுகிறது, பெரும்பாலும் ஒரு தனி ரெண்டரிங் பாஸ் தேவைப்படுகிறது, இது செயல்திறனைப் பாதிக்கலாம், அல்லது, வெளிப்படைத்தன்மை அடுக்குகளை வரிசைப்படுத்துதல் உள்ளிட்ட கூடுதல் சிக்கலான தீர்வுகள் தேவைப்படலாம்.
• செயல்படுத்தல் சிக்கலானது: டிஃபர்டு ரெண்டரிங்கை செயல்படுத்துவது பொதுவாக ஃபார்வர்டு ரெண்டரிங்கை விட சிக்கலானது, ரெண்டரிங் பைப்லைன் மற்றும் ஷேடர் புரோகிராமிங் பற்றிய நல்ல புரிதல் தேவைப்படுகிறது.

மேம்படுத்தல் உத்திகள் மற்றும் சிறந்த நடைமுறைகள்

டிஃபர்டு ரெண்டரிங்கின் நன்மைகளை அதிகரிக்க, பின்வரும் மேம்படுத்தல் உத்திகளைக் கவனியுங்கள்:

• ஜி-பஃப்பர் வடிவமைப்பு மேம்படுத்தல்: உங்கள் ஜி-பஃப்பர் டெக்ஸ்சர்களுக்கு சரியான வடிவங்களைத் தேர்ந்தெடுப்பது முக்கியம். காட்சித் தரத்தை கணிசமாகப் பாதிக்காமல் நினைவக நுகர்வைக் குறைக்க முடிந்தால் குறைந்த துல்லியமான வடிவங்களைப் (எ.கா., `RGBA32F` க்குப் பதிலாக `RGBA16F`) பயன்படுத்தவும்.
• டைல்டு அல்லது கிளஸ்டர்டு டிஃபர்டு ரெண்டரிங்: மிக அதிக எண்ணிக்கையிலான விளக்குகள் உள்ள காட்சிகளுக்கு, திரையை டைல்களாக அல்லது கிளஸ்டர்களாகப் பிரிக்கவும். பின்னர், ஒவ்வொரு டைல் அல்லது கிளஸ்டரைப் பாதிக்கும் விளக்குகளைக் கணக்கிடுங்கள், இது லைட்டிங் கணக்கீடுகளை வியத்தகு முறையில் குறைக்கிறது.
• தகவமைப்பு நுட்பங்கள்: சாதனத்தின் திறன்கள் மற்றும் காட்சியின் சிக்கலான தன்மையின் அடிப்படையில் ஜி-பஃப்பர் தெளிவுத்திறன் மற்றும்/அல்லது ரெண்டரிங் உத்திக்கான டைனமிக் சரிசெய்தல்களைச் செயல்படுத்தவும்.
• ஃபிரஸ்டம் கல்லிங் மற்றும் அக்லூஷன் கல்லிங்: டிஃபர்டு ரெண்டரிங்குடன் கூட, தேவையற்ற ஜியோமெட்ரியை ரெண்டர் செய்வதைத் தவிர்க்கவும் மற்றும் GPU மீதான சுமையைக் குறைக்கவும் இந்த நுட்பங்கள் இன்னும் பயனுள்ளதாக இருக்கும்.
• கவனமான ஷேடர் வடிவமைப்பு: திறமையான ஷேடர்களை எழுதுங்கள். சிக்கலான கணக்கீடுகளைத் தவிர்த்து, ஜி-பஃப்பர் டெக்ஸ்சர்களின் மாதிரியை மேம்படுத்தவும்.

நிஜ-உலக பயன்பாடுகள் மற்றும் எடுத்துக்காட்டுகள்

டிஃபர்டு ரெண்டரிங் பல்வேறு 3டி பயன்பாடுகளில் விரிவாகப் பயன்படுத்தப்படுகிறது. இங்கே சில எடுத்துக்காட்டுகள்:

• ஏஏஏ கேம்கள்: பல நவீன ஏஏஏ கேம்கள் உயர்தர காட்சிகள் மற்றும் அதிக எண்ணிக்கையிலான விளக்குகள் மற்றும் சிக்கலான விளைவுகளுக்கான ஆதரவை அடைய டிஃபர்டு ரெண்டரிங்கைப் பயன்படுத்துகின்றன. இது உலகளவில் வீரர்கள் ரசிக்கக்கூடிய ஆழ்ந்த மற்றும் பார்வைக்கு பிரமிக்க வைக்கும் விளையாட்டு உலகங்களை விளைவிக்கிறது.
• இணைய அடிப்படையிலான 3டி விஷுவலைசேஷன்கள்: கட்டிடக்கலை, தயாரிப்பு வடிவமைப்பு மற்றும் அறிவியல் உருவகப்படுத்துதல்களில் பயன்படுத்தப்படும் ஊடாடும் 3டி விஷுவலைசேஷன்கள் பெரும்பாலும் டிஃபர்டு ரெண்டரிங்கைப் பயன்படுத்துகின்றன. இந்த நுட்பம் பயனர்கள் ஒரு இணைய உலாவிக்குள் மிகவும் விரிவான 3டி மாதிரிகள் மற்றும் லைட்டிங் விளைவுகளுடன் தொடர்பு கொள்ள அனுமதிக்கிறது.
• 3டி கான்ஃபிகரேட்டர்கள்: கார்கள் அல்லது தளபாடங்கள் போன்ற தயாரிப்பு கான்ஃபிகரேட்டர்கள், பயனர்களுக்கு யதார்த்தமான லைட்டிங் விளைவுகள் மற்றும் பிரதிபலிப்புகள் உட்பட நிகழ்நேர தனிப்பயனாக்குதல் விருப்பங்களை வழங்க டிஃபர்டு ரெண்டரிங்கைப் பயன்படுத்துகின்றன.
• மருத்துவ விஷுவலைசேஷன்: மருத்துவப் பயன்பாடுகள் மருத்துவ ஸ்கேன்களின் விரிவான ஆய்வு மற்றும் பகுப்பாய்வை அனுமதிக்க 3டி ரெண்டரிங்கை அதிகளவில் பயன்படுத்துகின்றன, இது உலகளவில் ஆராய்ச்சியாளர்கள் மற்றும் மருத்துவர்களுக்கு பயனளிக்கிறது.
• அறிவியல் உருவகப்படுத்துதல்கள்: அறிவியல் உருவகப்படுத்துதல்கள் தெளிவான மற்றும் விளக்கமான தரவுக் காட்சிப்படுத்தலை வழங்க டிஃபர்டு ரெண்டரிங்கைப் பயன்படுத்துகின்றன, இது அனைத்து நாடுகளிலும் அறிவியல் கண்டுபிடிப்பு மற்றும் ஆய்வுக்கு உதவுகிறது.

எடுத்துக்காட்டு: ஒரு தயாரிப்பு கான்ஃபிகரேட்டர்

ஒரு ஆன்லைன் கார் கான்ஃபிகரேட்டரை கற்பனை செய்து பாருங்கள். பயனர்கள் காரின் பெயிண்ட் நிறம், மெட்டீரியல் மற்றும் லைட்டிங் நிலைமைகளை நிகழ்நேரத்தில் மாற்றலாம். டிஃபர்டு ரெண்டரிங் இது திறமையாக நடக்க அனுமதிக்கிறது. ஜி-பஃப்பர் காரின் மெட்டீரியல் பண்புகளைச் சேமிக்கிறது. லைட்டிங் பாஸ் பயனர் உள்ளீட்டின் அடிப்படையில் (சூரியனின் நிலை, சுற்றுப்புற ஒளி போன்றவை) லைட்டிங்கை மாறும் வகையில் கணக்கிடுகிறது. இது ஒரு புகைப்பட-யதார்த்தமான மாதிரிக்காட்சியை உருவாக்குகிறது, இது எந்தவொரு உலகளாவிய தயாரிப்பு கான்ஃபிகரேட்டருக்கும் ஒரு முக்கியமான தேவையாகும்.

வெப்ஜிஎல் மற்றும் டிஃபர்டு ரெண்டரிங்கின் எதிர்காலம்

வன்பொருள் மற்றும் மென்பொருளில் தொடர்ச்சியான மேம்பாடுகளுடன் வெப்ஜிஎல் தொடர்ந்து உருவாகி வருகிறது. வெப்ஜிஎல் 2.0 பரவலாக ஏற்றுக்கொள்ளப்படுவதால், டெவலப்பர்கள் செயல்திறன் மற்றும் அம்சங்களின் அடிப்படையில் அதிகரித்த திறன்களைக் காண்பார்கள். டிஃபர்டு ரெண்டரிங்கும் உருவாகி வருகிறது. வளர்ந்து வரும் போக்குகள் பின்வருமாறு:

• மேம்படுத்தப்பட்ட மேம்படுத்தல் நுட்பங்கள்: அனைத்து சாதனங்கள் மற்றும் உலாவிகளில், உலகளவில், இன்னும் ಹೆಚ್ಚಿನ விவரங்களுக்கு, நினைவக தடயத்தைக் குறைக்கவும் செயல்திறனை மேம்படுத்தவும் மிகவும் திறமையான நுட்பங்கள் தொடர்ந்து உருவாக்கப்பட்டு வருகின்றன.
• இயந்திர கற்றலுடன் ஒருங்கிணைப்பு: இயந்திர கற்றல் 3டி கிராபிக்ஸில் உருவாகி வருகிறது. இது மிகவும் புத்திசாலித்தனமான லைட்டிங் மற்றும் மேம்படுத்தலை செயல்படுத்தக்கூடும்.
• மேம்பட்ட ஷேடிங் மாதிரிகள்: இன்னும் ಹೆಚ್ಚಿನ யதார்த்தத்தை வழங்க புதிய ஷேடிங் மாதிரிகள் தொடர்ந்து அறிமுகப்படுத்தப்படுகின்றன.

முடிவுரை

டிஃபர்டு ரெண்டரிங், மல்டிபிள் ரெண்டர் டார்கெட்கள் (MRTs) மற்றும் ஜி-பஃப்பரின் சக்தியுடன் இணைந்தால், வெப்ஜிஎல் பயன்பாடுகளில் விதிவிலக்கான காட்சித் தரம் மற்றும் செயல்திறனை அடைய டெவலப்பர்களுக்கு அதிகாரம் அளிக்கிறது. இந்த நுட்பத்தின் அடிப்படைகளைப் புரிந்துகொண்டு இந்த வழிகாட்டியில் விவாதிக்கப்பட்ட சிறந்த நடைமுறைகளைப் பயன்படுத்துவதன் மூலம், உலகெங்கிலும் உள்ள டெவலப்பர்கள் இணைய அடிப்படையிலான கிராபிக்ஸின் எல்லைகளைத் தள்ளும் ஆழ்ந்த, ஊடாடும் 3டி அனுபவங்களை உருவாக்க முடியும். இந்த கருத்துக்களில் தேர்ச்சி பெறுவது, உலகெங்கிலும் உள்ள பயனர்களுக்கு அணுகக்கூடிய பார்வைக்கு பிரமிக்க வைக்கும் மற்றும் மிகவும் மேம்படுத்தப்பட்ட பயன்பாடுகளை வழங்க உங்களை அனுமதிக்கிறது. உங்கள் புவியியல் இருப்பிடம் அல்லது குறிப்பிட்ட மேம்பாட்டு இலக்குகளைப் பொருட்படுத்தாமல், வெப்ஜிஎல் 3டி ரெண்டரிங்கை உள்ளடக்கிய எந்தவொரு திட்டத்திற்கும் இது விலைமதிப்பற்றதாக இருக்கும்.

சவாலைத் தழுவுங்கள், சாத்தியக்கூறுகளை ஆராயுங்கள், மேலும் எப்போதும் வளர்ந்து வரும் இணைய கிராபிக்ஸ் உலகிற்கு பங்களிக்கவும்!